<template>
<Modal v-model="modal" width="466" class="commonModal" @on-cancel="$emit('close')" @on-visible-change="change" :loading="loading">
  <span slot="close"/>
  <p slot="header">提示</p>
  <div style="text-align:center;line-height:125px;font-size:18px;">
    <slot></slot>
  </div>
  <div slot="footer" style="text-align:center">
      <Button type="primary" size="small" @click="$emit('confirm')">确 定</Button>
      <Button type="primary" size="small" @click="$emit('close');" style="margin-left:40px;">取 消</Button>
  </div>
</Modal>
</template>

<script>
export default {
  name:'commonModal',
  props:{
    visible:{
      type:Boolean,
      default:()=>false
    },
    loading:{
      type:Boolean,
      default:()=>false
    },
  },
  watch:{
    visible(val){
       this.modal = val
    },
  },
  data(){
    return {
      modal:false
    }
  },
  methods:{
    change(val){
      if (!val) {
        this.$emit('close');
      }

    }
  }
}
</script>

<style lang="stylus">
.commonModal
  .ivu-modal-header
    border-bottom:none
  .ivu-modal-footer
    border-top:none
</style>
